<template>
  <Header>
    <div class="flex">
      <div class="flex-1">
        <dimension-value v-bind="[$props]"></dimension-value>
      </div>
      <div class="flex-mani">
        <!-- <Button type="text" icon="md-document">生成JSON</Button> -->
        <Button type="text" icon="md-eye" @click="preview">预览</Button>
      </div>
    </div>
  </Header>
</template>
<script type="text/javascript">
import { EDITOR_TYPE } from '@/tools/constant';
import DimensionValue from './dimension-value';

export default {
  components: {
    DimensionValue
  },
  data () {
    return {
    }
  },
  props: {
    uiItemList: {
      type: Array,
      default: function() {
        return []
      }
    },
    selectedIndex: {
      type: [Number, String]
    },
    echartDrag: {
      type: Object,
      default: function() {
        return {}
      }
    }
  },
  computed: {
    isChart () {
      if (this.selectedIndex >= 0 && this.uiItemList.length > 0 && this.uiItemList.length > this.selectedIndex) {
        return this.uiItemList[this.selectedIndex].type === EDITOR_TYPE[0]
      }
    	return false
    }
  },
  methods: {
    preview () {
      this.$emit('preview')
    }
  }
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
</style>
